import React, { useEffect, useState } from 'react'
import Header from '../../components/Header/Header'
import Goods from './components/Goods/Goods'
import NewPeople from './components/NewPeople/NewPeople'
import Group from './components/Group/Group'
import { reqgetnew, reqgetgroupon, reqgetindexgoods } from '../../http/api'
// export default class Home extends Component {


//   componentDidMount(){
//     //请求新人专享数据
//     this.getnewList();
//     //请求万人团数据
//     this.getgroupList();
//     //请求首页分类商品信息
//     this.getindexgoodsList();
//   }

// }
export default function Home(props) {
  let [newList, setNewList] = useState([]);
  let [groupList, setGroupList] = useState([]);
  let [indexGoodsList, setIndexGoodsList] = useState([]);
  let [n, setN] = useState(0);
  let getnewList = async () => {
    let { data: res } = await reqgetnew();
    if (res.code === 200) {
      let arr = res.list ? res.list : [];
      setNewList(arr);
    }
  }
  let getgroupList = async () => {
    let { data: res } = await reqgetgroupon()
    if (res.code == 200) {
      let arr = res.list ? res.list : [];
      setGroupList(arr)
    }
  }
  let getindexgoodsList = async () => {
    let { data: res } = await reqgetindexgoods();
    if (res.code === 200) {
      let list = res.list;
      let arr0 = list[0].content ? list[0].content : [];
      let arr1 = list[1].content ? list[1].content : [];
      let arr2 = list[2].content ? list[2].content : [];
      let arr3 = list[3].content ? list[3].content : [];
      setIndexGoodsList([arr0,arr1,arr2,arr3]);
    }
  }
  useEffect(()=>{
    getnewList();
    getgroupList();
    getindexgoodsList();
  },[])
  return (
    <div className='homeBox'>
      <Header title="首页"></Header>
      <NewPeople newList={newList}></NewPeople>
      <Group groupList={groupList}></Group>
      <Goods changeN={(n) => setN(n)} indexGoodsList={indexGoodsList} n={n}></Goods>
    </div>
  )
}

